<template>
    <div>
        <img src="../../assets/images/cosmetics/17041989472999964.png" style="width: 100%;">
        <div class="cosmeticgoods-box padding-item">
            <div class="padding-txt">
                <h2>彩妆</h2>
                <span>首页>彩妆</span>
            </div>
            <div class="padding-goods" v-if="cosmeticList!==null">
                <div class="good_item" v-for="(item,index) in cosmeticList" :key="index" @click="checkDetail(item.goodsId)">
                    <div class="good_img">
                        <img style="width: 100%;height: 100%;" :src="require('../../assets/images/' + item.coverImg)" />
                    </div>
                    <div class="good_txt">{{ item.goodsName }}</div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { loadDataList } from '@/utils/api/goods';

export default {
    name:"cosmetic",
    data(){
        return {
            cosmeticList:null
        }
    },
    created(){
        const that=this
        loadDataList({categoryId:1}).then(data=>{
            console.log(data)
            that.cosmeticList=data.list
        })
    },
    methods:{
        checkDetail(goodsId){
            this.$router.push({
                path:"/detailGood",
                query:{
                    id:goodsId
                }
            })
        }
    }
}
</script>

<style>
</style>